<!-- 
      findDetail.html
      发现详细内容  id  = findDetail
      
      Created by tang on 2017-03-14.
      Copyright 2017 tang. All rights reserved.
 -->
<!doctype html>
<html>
<head>
	<meta charset="UTF-8">
	<title></title>
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<link href="../css/mui.min.css" rel="stylesheet" />
	<link rel="stylesheet" href="../css/find.css" />
</head>
<body class="gray">
	<div class="mui-content findDetail loading" id="vueMain">
	    <div class="find-title">
	    		<img src="../icon/mask-big.jpg" :data-load="detail.photo" class="maximg" alt="" />
	    		<div>
	    			<h2>{{detail.title}}</h2>
	    			<h5>来自 {{detail.froms}}</h5>
	    		</div>
	    </div>
	    <div class="find-coller">
	    		<p><img src="../icon/shou.png" class="like" alt="" /> 已有{{detail.num}}人喜欢</p>
	    		<div>{{detail.two_title}}</div>
	    </div>
	    <div class="find-body" v-html="detail.content"> </div>
	</div>
<script src="../js/mui.js"></script>
<script src="../js/vue.min.js"></script>
<script src="../js/mui.zoom.js"></script>
<script src="../js/mui.previewimage.js"></script>
<script src="../js/bexta.js"></script>
<script type="text/javascript">
	var apps, views;
	mui.init()
	
	mui.plusReady(function () {
	    views = bexta.getWebview();
	    bexta.ajax(api.find_detail, function(res){
	    		initVue(res);
	    },{data:{id:views.fid}});
	});
	function initVue(res){
		apps = new Vue({
			el:'#vueMain',
			data:{
				detail:res
			},
			mounted:function(){
				bexta.imageLoad('[data-load]');
				document.querySelector('.loading').classList.add('loadRun');
				var img = document.querySelectorAll('.find-body img');
			   	for( var i = 0 ,len = img.length; i < len ; i++  ){
			   		img[i].setAttribute('data-preview-src', '');
			   		img[i].setAttribute('data-preview-group', 1);
			   	}
			   	if( img.length > 0  ){
			   		mui.previewImage();
			   	}
			   	mui('body').on('tap', '.like', function(){
			   		var self = this;
			   		if( !self.getAttribute('data-active') ){
			   			bexta.ajax(api.find_praise, function(res){
				   			self.setAttribute('data-active', 1);
				   			self.setAttribute('src', '../icon/shou-active.png');
							apps.detail.num++;
						}, {data:{id:views.fid}})
			   		}
			   		
			   	});
			}
		});
	}
	
</script>
</body>
</html>